<template>
	<view>
		<carHeader :title="'订单支付'"></carHeader>
		<view class="tuceng">
			<image src="/static/车联网服务-01专业洗车-08洗车-订单支付_slices/对 拷贝@3x.png" mode=""></image>
			<view class="text1">
				<text>支付成功</text>
			</view>
			<view class="text2">
				<text>{{money}}</text>
			</view>
			<view class="text3">
				<text>订单编号：{{orderDetailsId}}</text>
			</view>

			<view class="btn">
				<button class="btn1" @click="home">返回首页</button>
				<button class="btn2" @click="detail">订单详情</button>
			</view>
		</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {
				orderDetailsId:null,
				money:null
			}
		},
		onLoad(options) {
			  const complexData = {};
			  for (let [key, value] of Object.entries(options)) {
			    complexData[key] = decodeURIComponent(value);
			  }
			  // 使用解析后的数据
			  console.log(complexData);
			  this.orderDetailsId = complexData.detaildId;
			  this.money = complexData.totalMoney;
			  console.log(this.orderDetailsId);
			  //根据订单ID ，生成核销码和核销二维码，并将核销码和核销二维码更新到数据库表中 
			  //待完善
			  const that = this;
			  uni.request({
			  	url:"http://localhost:8080/carUser/file/generateCode",
				data:{
					id: this.orderDetailsId
				},
				success(res) {
					console.log(res);
					let orderDetailsId = that.orderDetailsId;
					let verCode = res.data.data.code;
					let verImage = res.data.data.codePath;
					//再次网络请求，修改订单的核销码和核销凭证
					uni.request({
						url:"http://localhost:8080/carUser/updateCodeAndImg",
						data:{
							orderDetailsId: orderDetailsId,
							verCode: verCode,
							verImage: verImage
						},
						success(res) {
							console.log(res)
						}
					})	
				},
				fail() {
					console.log("失败了")
				}
			  })
			  
		},
		methods: {
		home(){
			uni.navigateTo({
				url:"/pages/index/index"
			})
		},
		detail(){
			const complexData = {
			  orderDetailsId: this.orderDetailsId
			};
			const queryStr = Object.keys(complexData)
			  .map(key => `${encodeURIComponent(key)}=${encodeURIComponent(complexData[key])}`)
			  .join('&');
			uni.navigateTo({
			  url: `/pages/dingdan/dingdan?${queryStr}`
			});
		}
		}
	}
</script>

<style lang="scss">
	.tuceng {
		width: 95%;
		height: 900rpx;
		background-color: #fff;
		margin: 0 auto;
		position: relative;
		top: -230rpx;
		border-radius: 20rpx;
		text-align: center;

		image {
			width: 150rpx;
			height: 150rpx;
			position: relative;
			top: 80rpx;
		}

		.text1 {
			position: relative;
			font-size: 30rpx;
			// font-weight: 1000;
			top: 90rpx;
		}

		.text2 {
			position: relative;
			font-size: 80rpx;
			font-weight: 800;
			top: 130rpx;
		}

		.text3 {
			position: relative;
			font-size: 30rpx;
			// font-weight: 1000;
			top: 180rpx;
		}
		.btn{
			position: relative;
			top: 250rpx;
			.btn1{
				margin-bottom: 30rpx;
				color: white;
				background-color: #0073de;
				border-radius: 50rpx;
				width: 75%;
			}
			.btn2{
				margin-bottom: 30rpx;
				color: white;
				background-color: #dedede;
				border-radius: 50rpx;
				width: 75%;
			}
		}
	}
</style>